<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title th:text="${title}"></title>

    <div th:include="/common/layui"></div>
    <div th:include="/common/jq"></div>

    <!--添加 layui 自己的 css js  支持加载-->
    <link href="/css/houtai/manage_base.css"	rel="stylesheet" />
    <script	src="/js/houtai/manage_base.js"></script>
    <!--添加 layui 自己的 css js  支持加载-->

</head>

<script>
    //定义在外面。可以代码中  使用 table
    var table;
    layui.use([ 'laydate', 'laypage', 'layer','form', 'table', 'carousel',
        'upload', 'element' ], function() {
        table = layui.table;
    });

    var global_ids;
    var global_ids_len;

    var w ;//窗口的宽
    var h ;//窗口的高

    function returnbook(id){
        //询问框
        layer.confirm('您是否要归还此书？', {
            btn: ['是','取消'] //按钮
        }, function(){

            $.post("/admin/bookborrow/returnbook",{borrowID:id},function(result){
                if(result.success){
                    layer.closeAll();
                    layer.msg(result.msg);

                    reload_data();
                }else{
                    layer.closeAll();//关闭loading
                    layer.msg(result.msg);
                }
            },'json');

        }, function(){
            layer.closeAll();//关闭loading
            layer.msg('您选择是取消');
        });
    }

    //子窗口调用 的  关闭窗口方法
    function closeDlg(msg){
        layer.closeAll();
        layer.msg(msg);
        reload_data();
    }

    //相当前刷新  重新加载
    function reload_data(){
        var bookname  = $("#bookname").val();
        var username  = $("#username").val();
        var btype = $("input[name='btype']:checked").val();
        table.reload('table', {
            where: {
                bookname:bookname
                ,username:username
                ,btype:btype
            },page: {curr: 1 //重新从第 1 页开始
            }
        });
    }

</script>

<body style="padding-top: 3px;">

<div class="layui-form">
    <div class="layui-form-item">
        <label class="layui-form-label">图书名称</label>
        <div class="layui-input-inline">
            <input type="text" id="bookname" onkeydown="if(event.keyCode==13) reload_data()" name="title"
                   lay-verify="title" autocomplete="off" placeholder="请输入图书名称" class="layui-input">
        </div>
        <label class="layui-form-label">借阅人</label>
        <div class="layui-input-inline">
            <input type="text" id="username" name="title" placeholder="请输入借阅人姓名" autocomplete="off" class="layui-input">
        </div>
        <label class="layui-form-label">状态</label>
                <input type="radio" name="btype" value="2" title="已还">
                <input type="radio" name="btype" value="1" title="未还" checked>
        <a class="layui-btn" onclick="reload_data()">查询</a>
    </div>
</div>

<table class="layui-hide"   id="table" lay-filter="table"></table>
</body>

<script type="text/html" id="table_bar">
    <div class="layui-btn-group">
        <a class="layui-btn layui-btn-xs" lay-event="returnbook">归还此书</a>
    </div>
</script>

<script type="text/html" id="format_user_name">
    {{#  if(d.user!= null){ }}
    {{d.user.trueName}}
    {{#  } else { }}
    {{#  } }}
</script>

<script type="text/html" id="format_book_name">
    {{#  if(d.book!= null){ }}
    {{d.book.name}}
    {{#  } else { }}
    {{#  } }}
</script>

<script type="text/html" id="format_user_num">
    {{#  if(d.user!= null){ }}
    {{d.user.id}}
    {{#  } else { }}
    {{#  } }}
</script>

<script type="text/html" id="format_book_bianhao">
    {{#  if(d.book!= null){ }}
    {{d.book.bianhao}}
    {{#  } else { }}
    {{#  } }}
</script>

<script type="text/html" id="format_type">
    {{#  if(d.type== 1){ }}
    未还
    {{#  } else { }}
    已还
    {{#  } }}
</script>

<script type="text/html" id="format_record">
    {{#  if(d.record== 0){ }}
    等待审批
    {{#  } else if(d.record== 1){ }}
    审批通过
    {{#  } else { }}
    审批未通过
    {{#  } }}
</script>
<script>
    layui.use([ 'laydate', 'laypage', 'layer', 'table', 'carousel',
        'upload', 'element' ], function() {
        var laydate = layui.laydate //日期
            , laypage = layui.laypage //分页
            ,layer = layui.layer //弹层
            , table = layui.table //表格
            , carousel = layui.carousel //轮播
            , upload = layui.upload //上传
            , element = layui.element; //元素操作



        table.render({
            elem: '#table'
            ,url: '/admin/bookborrow/list?record=1'
            ,height: 'full-60'
            ,totalRow: true
            ,cols:  [ [
                {checkbox: true, width:50, fixed: true}
               /* ,{field:'userId', title: '读者号', width:80 ,style:'font-size: 12px;',templet: '#format_user_num'}
                ,{field:'userId', title: '借阅人姓名', width:90 ,style:'font-size: 12px;',templet: '#format_user_name'}

              ,{field:'bookId', title: '图书编号', width:120,  style:'font-size: 12px;',templet: '#format_book_bianhao'}*/
                ,{field:'username', title: '借阅人姓名', width:'10%' ,style:'font-size: 12px;'}
                ,{field:'bookId', title: '图书名称', width:'20%',  style:'font-size: 12px;',templet: '#format_book_name'}

                ,{field:'type', title: '状态', width:'10%',  style:'font-size: 12px;',templet: '#format_type'}
                ,{field:'record', title: '审批状态', width:'10%',  style:'font-size: 12px;',templet: '#format_record'}

                ,{field:'borrowDateTime', title: '借阅时间', width:'15%',  style:'font-size: 12px;'}
                ,{field:'returnDateTime', title: '归还时间', width:'15%',  style:'font-size: 12px;'}
                ,{fixed:'right', width:'15%',title: '操作',  toolbar: '#table_bar'}

            ] ]
            ,id: 'table'
            ,page: true
            ,limits:[10,20,30,50],
            limit:10
        });

        //监听工具条 table_bar
        table.on('tool(table)', function(obj) { //注：tool是工具条事件名，test是table原始容器的属性 lay-filter="对应的值"
            var data = obj.data //获得当前行数据
                , layEvent = obj.event; //获得 lay-event 对应的值
            if (layEvent === 'return') {
                return(data.id);
            }
            if (layEvent === 'returnbook') {
                returnbook(data.id);
            }
        });

    });
</script>



</html>